<template>
    <div class="page">
        <div class="table-head-tabs">
            <div class="item">
                <span>全部（23457）</span>
            </div>
            <div class="item">
                <img src="../../assets/icon-addpeople.svg">
                <span>加入</span>
            </div>
            <div class="item">
                <img src="../../assets/icon-filter.png">
                <span>筛选</span>
            </div>
        </div>
        <swiper :options="swiperOptions" :auto="2000" :height="165"/>

        <div class="item-content">
            <finance-item v-for="(item, k) in itemList" :key="k" :data="item" @onclick="handleItemClick"/>
        </div>

    </div>
</template>

<style lang="less" scoped>

    @import '../../style/variable';

    .page{
        .table-head-tabs{
            display: flex;
            .item{
                flex: 1;
                text-align: center;
                img{
                    height: 1rem;
                    margin: 1.15rem .5rem;
                    vertical-align: bottom;
                }
                span{
                    font-size: 1.1rem;
                    line-height: 3.3rem;
                }
            }
        }

        .item-content{
            border-top: .8rem solid @color-bg-gray;
        }

    }

</style>

<script>
    export default {
        data (){
            const swiperOptions = [
                {
                    src: 'https://img.yzcdn.cn/public_files/2017/10/24/e5a5a02309a41f9f5def56684808d9ae.jpeg',
                    to: '/same'
                },
                'https://img.yzcdn.cn/public_files/2017/10/24/1791ba14088f9c2be8c610d0a6cc0f93.jpeg'
            ];

            const itemList = Array(4).fill({
                name: '林小磊 - 金融市场部总经理',
                official: 'www.djs18.com',
                industry: '券商',
                tel: '0755-82786009',
                fax: '0755-82786009',
                email: 'service@djs18.com',
                address: '深圳市福田区石厦北二街新天世纪商务中心A座2302室',
            }).map((o, k)=>{
                o.collection = !!(k % 2);
                return {...o};
            });



            return {swiperOptions, itemList}
        },
        methods: {
            handleItemClick(){
                this.$router.push('/same/financeCompanyDetail');
            }
        }
    }
</script>